<template>
    <div class="bottom">
        <div class="box">
            <div class="friend-link">友情链接：</div>
            <div style="min-height: 40px; text-align: center;">
                <ul>
                    <li v-for="item in linkList" :key="item.dictCode"><a :href="item.dictValue" target="_blank">{{ item.dictLabel }}</a></li>
                </ul>
            </div>
            <div style="height: 1px; width: 1000px; margin: auto;">
                <div style="height: 1px; border: 1px solid rgb(84, 84, 84);"></div>
            </div>
            <div class="company">Copyright © 2017-2025 石家庄天亮教育科技有限公司 备案号:冀ICP备17020003号</div>
        </div>
    </div>
</template>
<script>
    import { getLink } from "../api/request"
    export default {
        data() {
            return {
                linkList:[]
            };
        },
        components: {},
        methods: {},
        beforeCreate() {
            
        },
        created() {
            getLink().then(res => {
                console.log(res.rows);
                this.linkList = res.rows;
            })
        },
        beforeMount() {
            
        },
        mounted() {
            
        },
        beforeUpdate() {
            
        },
        updated() {
            
        },
        beforeDestroy() {
            
        },
        destroyed() {
            
        }
    };
</script>
<style lang="scss" scoped>
* {
  margin: 0;
  padding: 0; 
}
ul, li {
  list-style: none; 
}
a {
  text-decoration: none; 
}
.bottom {
  background: #0f141a;
  color: #777878;
  font-size: 14px;
  line-height: 30px;
}
.bottom > .box {
  padding: 20px 0;
  width: 1160px;
  margin: auto;
}
.bottom > .box .friend-link {
  width: 51%;
  color: #fff;
  font-size: 22px;
  margin: 16px auto;
}
.bottom > .box > div a {
  font-size: 14px;
  color: #999;
}
.bottom ul {
  margin: 0 auto;
  width: 800px;
  height: 20px;
  display: flex;
  justify-content: space-around;
}
.bottom ul a{
  text-align: center;
  text-decoration: none;
  width: 200px;
  // height: 100px;
  color: white;
}
.bottom > .box .company {
  text-align: center;
}
</style>